<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>1</li>
        <li>2</li>
    </ul>
    <script>
        // 获取父元素
        var oul = document.getElementsByTagName('ul')[0]

        oul.onclick=function(evn){
            var ev = window.ev || evn

            // ev.target.nodeName 获取事件源下的子节点
            if(ev.target.nodeName=='LI'){
                console.log('this me')
            }
        }

        // oul.addEventListener('click',function(ev){
        //     // ev.target.nodeName 获取事件源下的子节点
        //     if(ev.target.nodeName ==='LI') {
        //         console.log('事件委托')
        //         console.log(this)
        //         事件委托:就是委托一个对象给另一个对象添加事件,也称为事件代理
        //         事件委托原理: 通过冒泡事件指定某一个元素去执行对应的程序,方便管理一个类型的时间
        //         事件委托实现: 给父元素添加事件,让父元素通知子元素执行程序
        //         特点: 后面新增的也会有事件
        //         应用场景: 给1000+个li添加事件

                
        //     }
        // })
</script>
</body>
</html>